<template>
  <div class="async">
    <el-card :body-style="{ padding: '0px', marginBottom: '1px' }">
      <img :src="userInfo?.img || ''" class="image" />
      <div style="padding: 14px">
        <span>{{ userInfo?.name }}</span>
        <div class="bottom card-header">
          <div class="time">{{ userInfo?.desc }}</div>
          <el-button text class="button">operation button</el-button>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import xwAxios from "@/utils/axios";
const loading = ref(false);

const userInfo = ref();
loading.value = true;
const res = await xwAxios({
  method: "get",
  url: "/data.json",
  delay: 2000,
});
// console.log("data", data);

// console.log("data", data);

// @ts-ignore
userInfo.value = res?.data;

loading.value = false;
</script>

<style lang="scss" scoped></style>
